page,
view,
scroll-view,
text,
image,
textarea,
button,
swiper,
swiper-item,
input {
  box-sizing: border-box;
}

view[hidden] {
  display: none !important;
}

page {
  background-color: $uni-bg-color-grey;
  height: 100%;
  font-size: 30rpx;
  color: $uni-text-color;
}

.container {
  width: 100%;
  height: 100%;
}


.border-box {
  box-sizing: border-box;
}


.border-radius-base {
  border-radius: 6rpx;
}

.border-radius-lg {
  border-radius: 12rpx;
}

.border-b {
  border-bottom: 1px #EDEDED solid;
}

.border-t {
  border-top: 1px #EDEDED solid;
}

.border-l {
  border-left: 1px #EDEDED solid;
}

.border-r {
  border-right: 1px #EDEDED solid;
}


/* 弹性布局 */
.flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.flex-column {
  flex-direction: column;
}


.justify-between {
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}


.align-center {
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}


$length: 1000;

@mixin create-ctx-style($len) {
  .mt-#{$len} {
    margin-top: 1upx * $len !important;
  }
  .ml-#{$len} {
    margin-left: 1upx * $len !important;
  }
  .mr-#{$len} {
    margin-right: 1upx * $len !important;
  }
  .mb-#{$len} {
    margin-bottom: 1upx * $len !important;
  }
  .mlr-#{$len} {
    margin: 0 1upx * $len !important;
  }
  .mtb-#{$len} {
    margin: 1upx * $len 0 !important;
  }
  .pd-#{$len} {
    padding: 1upx * $len !important;
  }
  .pt-#{$len} {
    padding-top: 1upx * $len !important;
  }
  .pl-#{$len} {
    padding-left: 1upx * $len !important;
  }
  .pr-#{$len} {
    padding-right: 1upx * $len !important;
  }
  .pb-#{$len} {
    padding-bottom: 1upx * $len !important;
  }
  .plr-#{$len} {
    box-sizing: border-box;
    padding-left: 1upx * $len !important;
    padding-right: 1upx * $len !important;
  }
  .ptb-#{$len} {
    box-sizing: border-box;
    padding-top: 1upx * $len !important;
    padding-bottom: 1upx * $len !important;
  }
  .padding-#{$len} {
    box-sizing: border-box;
    padding: 1upx * $len !important;
  }
  .fsize-#{$len} {
    font-size: 1upx * $len !important;
  }
}

@while $length>=0 {
  @include create-ctx-style($length);
  $length: $length - 2;
}

/*1-1000*/
$local: 1000;

@while $local >=0 {
  .h-#{$local} {
    height: 1% * $local !important;
  }

  /*高度upx*/
  .height-#{$local} {
    height: 1upx * $local !important;
  }
  /* 行高 */
  .lh-#{$local} {
    line-height: 1upx * $local !important;
  }
  /*宽度度百分比*/
  .w-#{$local} {
    width: 1% * $local !important;
  }
  .border-radius-#{$local} {
    border-radius: 1upx * $local !important;
  }
  .border-radius-tl-#{$local} {
    border-top-left-radius: 1upx * $local !important;
  }
  .border-radius-tr-#{$local} {
    border-top-right-radius: 1upx * $local !important;
  }
  .border-radius-bl-#{$local} {
    border-bottom-left-radius: 1upx * $local !important;
  }
  .border-radius-br-#{$local} {
    border-bottom-right-radius: 1upx * $local !important;
  }
  /*宽度upx*/
  .width-#{$local} {
    width: 1upx * $local !important;
  }
  .fweigh-#{$local} {
    font-weight: 1*$local;
  }
  $local: $local - 1
}

$line: 10;
@while $line >=0 {
  .text-ellipsis-#{$local} {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1 * $line;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }
  $line: $line - 1
}

/*背景颜色*/
.bg-white {
  background-color: #ffffff;
  color: #0a0a0a;
}

/*字体颜色*/
.text-red {
  color: #e54d42;
}

.text-gray {
  color: #aaaaaa;
}

.text-white {
  color: $color-white;
}

.text-pla {
  color: #c0c4cc
}